<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="icon"  href="../../images/index/title-logo.ico">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>山水婺源</title>
    <link rel="stylesheet" href="../../images/font_4304807_m6hg5qktm2/iconfont.css">
    <link rel="stylesheet" href="./user.css">
</head>
<body>
    <div class="center">
        <!-- 一级导航栏 -->
        <div class="first-header">
            
                    <div class="txt">
                        <p><img src="../../images/Introduction/logo.png" alt=""></p>
                    </div>
                    <ul>
                        
                        <li><a href="../../index.html">首页</a></li>
                        <li><a href="../login/login.html" id="exit">请先登录</a></li>
                        <li><a href="../Introduction/Introduction.html">畅玩婺源</a></li>
                        <li><a href="../Forum/Forum.html">用户论坛</a></li>
                    </ul>
                
        </div>
        <!-- 二级导航栏 -->
        <div class="header">
            <div class="content">
                
                <div class="text">
                    <h2>个人中心</h2>
                    <span>|  分享、结伴、攻略</span>
                </div>
                <div class="input">
                    <input type="text" placeholder="请输入想查询的内容">
                    <i class="iconfont icon-sousuo1"></i>
                </div>
            </div>
            <div class="setting"><i class="iconfont icon-shezhi1"></i></div>
        </div>
        <!-- 二级导航栏 -->

        <!-- 主要内容 --> 
        <div id="content" >
            <div class="left">
                <ul>
                    <li id="userinfo" class="active ">个人信息</li>
                    <li id="orderfrom">订单信息</li>
                    <li id="commit">聊天交友</li>
                    <li id="answer">客服答疑</li>
                </ul>
            </div>
            <div class="right " id="userInfo">
                <!-- 个人信息 -->
                <div id="info">
                    <div class="info">
                        <div class="top">
                            <div class="img">
                                <img src="../../images/Forum/user1.jpg" alt="">
                            </div>
                            <div class="detali">
                                <div class="pickname">
                                    <span>顾言</span>
                                    <i class="iconfont icon-shoucangguanzhu"></i>
                                    <i class="iconfont icon-xiaoxi"></i>
                                </div>
                                <div class="phone">
                                    <span><i class="iconfont icon-shouji"></i>16537489876</span>
                                    <i class="iconfont icon-envelope-full"></i>
                                    <i class="iconfont icon-qq"></i>
                                    <i class="iconfont icon-weixin1"></i>
                                    <i class="iconfont icon-weibo1"></i>
                                </div>
                            </div>
                            <div class="setting"><i class="iconfont icon-shezhi"></i></div>
                        </div>
                        <div class="bottom">
                            <div class="title"><h4>修改信息</h4><span></span></div>
                            <div class="form">
                                <div class="left">
                                    <div class="pickname">
                                        <label for="pickname">昵称：</label>
                                        <input type="text">
                                    </div>
                                    <div class="gender">
                                        <label for="gender">性别：</label>
                                         男<input type="radio" name="gender" checked>
                                         女<input type="radio" name="gender">
                                    </div>
                                    <div class="username">
                                        <label for="username">用户名：</label>
                                        <input type="text">
                                    </div>
                                    <div class="phone">
                                        <label for="phone">手机号：</label>
                                        <input type="text">
                                    </div>
                                    <div class="birthday">
                                        <label for="brithday" >生日:</label>
                                        <input type="date" value="2023-12-13">
                                    </div>
                                </div>
                                <div class="right">
                                    <div class="pic">
                                        <label for="pic">头像：</label>
                                        <div>+</div>
                                </div>
                            </div>
                            
                         </div>
                         <div class="textare">
                            <label for="textare">个人简介：</label>
                            <textarea name="" id="1" cols="30" rows="10"></textarea>
                        </div>
                        <div class="sumbit">
                            <button>提交</button>
                        </div>
                    </div>
                    </div>
                    
                </div>
                <div class="date">
                    <div class="top">
                        <h4>我的日历</h4>
                        <span style="--i: 1"></span>
                        <span style="--i: 1"></span>
                        <span style="--i: 2"></span>
                        <span style="--i: 3"></span>
                    </div>
                    <div class="bottom">
                        <div class="time">12:54:23</div>
                        <div class="week">星期x</div>
                        <div class="day">20xx-0x-xx</div>
                    </div>
                    <div class="weather">
                        <!-- 天气内容 -->
                        <div class="up">南昌</div>
                        <div class="down">
                            
                            <div class="icon">
                               
                                <div class="tem">
                                    <span>8</span><i>℃</i>
                                </div>
                                <div class="font">
                                    <i class="iconfont icon-qing"></i>
                                    <div class="atom">
                                        <div class="item1"><span>北风3级</span></div>
                                        <div class="item2"><span>-3~12℃</span><span>64良</span></div>
                                        
                                    </div>
                                </div>
                                
                            </div>
                           
                        </div>
                        <div class="advice">
                            <i class="iconfont icon-xiche-cuxiantiao"></i>
                            <i class="iconfont icon-yixueyundong"></i>
                            <i class="iconfont icon-a-baonuanshangyi1x"></i>
                            <i class="iconfont icon-gaobaoshi"></i>
                        </div>
                    </div>
                </div>
                <!-- 个人信息 -->
            </div>
            <div class="orderFrom hide ">
                <div class="title">
                    <ul>
                        <li id="ticket" class="active" ><i class="iconfont icon-lvyoumenpiao" id="ticket"></i><span>门票</span></li>
                        <li id="shopping"><i class="iconfont icon-gouwu" id="shopping"></i><span>购物</span></li>
                        <li id="living"><i class="iconfont icon-xinfang" id="living"></i><span>住宿</span></li>
                        <li id="guide"><i class="iconfont icon-shenqingdaoyou-01" id="guide"></i><span>导游</span></li>
                        <div class="indicator"></div>
                    </ul>
                </div>
                <div class="order">
                 <ul>
                    <li>
                        <div class="left"><img src="../../images/WuNvZhou/menpiao1.png" alt=""></div>
                        <div class="right">
                            <p>婺女洲度假区门票（可订今日票+刷身份证快速入园+夜游体验打...</p>
                            <div class="date">游玩时间：2023-12-25</div>
                        </div>
                        <div class="price">
                            <div class="oldPrice"><span>￥</span>143</div>
                            <div class="newPrice"><span>￥</span>90</div>
                        </div>
                        <div class="progression">
                            <div class="top">
                                <div class="start"><i class="iconfont icon-xiadan"></i></div>
                                <div class="middle"><i class="iconfont icon-zhifubao"></i></div>
                                <div class="end"><i class="iconfont icon-wancheng"></i></div>
                            </div>
                            <div class="bottom">
                                <div class="text">
                                    <div class="name"><span>联系人：</span>顾言</div>
                                    <div class="code"><span>订单编号：</span>DN234543</div>
                                    <div class="phone"><span>手机号:</span>154354637465</div>
                                    <div class="time"><span>场次：</span>下午</div>
                                    <div class="servicec"><span>客服：</span>09778-131313</div>
                                </div>
                                <div class="img"><span>门票二维码</span></div>
                            </div>
                        </div>
                        <div class="message">点击查看详情</div>
                    </li>
                    <li>
                        <div class="left"><img src="../../images/WuNvZhou/menpiao3.png" alt=""></div>
                        <div class="right">
                            <p>婺女洲度假区门票（可订今日票+刷身份证快速入园+夜游体验打...</p>
                            <div class="date">游玩时间：2023-07-25</div>
                        </div>
                        <div class="price">
                            <div class="oldPrice"><span>￥</span>169</div>
                            <div class="newPrice"><span>￥</span>120</div>
                        </div>
                        <div class="progression">
                            <div class="top">
                                <div class="start"><i class="iconfont icon-xiadan"></i></div>
                                <div class="middle"><i class="iconfont icon-zhifubao"></i></div>
                                <div class="end"><i class="iconfont icon-wancheng"></i></div>
                            </div>
                            <div class="bottom">
                                <div class="text">
                                    <div class="name"><span>联系人：</span>顾言</div>
                                    <div class="code"><span>订单编号：</span>DN234543</div>
                                    <div class="phone"><span>手机号:</span>154354637465</div>
                                    <div class="time"><span>场次：</span>下午</div>
                                    <div class="servicec"><span>客服：</span>09778-131313</div>
                                </div>
                                <div class="img"><span>门票二维码</span></div>
                            </div>
                        </div>
                        <div class="message">点击查看详情</div>
                    </li>
                    <li>
                        <div class="left"><img src="../../images/WuNvZhou/menpiao4.png" alt=""></div>
                        <div class="right">
                            <p>婺女洲度假区门票（可订今日票+刷身份证快速入园+夜游体验打...</p>
                            <div class="date">游玩时间：2023-09-05</div>
                        </div>
                        <div class="price">
                            <div class="oldPrice"><span>￥</span>126</div>
                            <div class="newPrice"><span>￥</span>70</div>
                        </div>
                        <div class="progression">
                            <div class="top">
                                <div class="start"><i class="iconfont icon-xiadan"></i></div>
                                <div class="middle"><i class="iconfont icon-zhifubao"></i></div>
                                <div class="end"><i class="iconfont icon-wancheng"></i></div>
                            </div>
                            <div class="bottom">
                                <div class="text">
                                    <div class="name"><span>联系人：</span>顾言</div>
                                    <div class="code"><span>订单编号：</span>DN234543</div>
                                    <div class="phone"><span>手机号:</span>154354637465</div>
                                    <div class="time"><span>场次：</span>下午</div>
                                    <div class="servicec"><span>客服：</span>09778-131313</div>
                                </div>
                                <div class="img"><span>门票二维码</span></div>
                            </div>
                        </div>
                        <div class="message">点击查看详情</div>
                    </li>
                 
                   
                 </ul>
                </div>
            </div>
            <div class="commit hide">聊天页面正在开发中...</div>
            <div class="answer hide">客服页面正在开发中...</div>

        </div>
        
        <!-- 主要内容 -->
       


        <!-- 版权部分 -->
        <div class="footer">
            <div class="left">
                <p>版权所有：Copyright © 2023 顾言</p>
                <p>电话（tel）: 123-738-84763 </p>
                <p>邮箱：13163738746@163com</p>
            </div>
            <div class="right">
                <div class="us">
                    <h4>关注我们</h4>
                </div>
                <ul>
                    <li class="active">
                        <i class="iconfont icon-weixin"></i>
                        <div class="box"></div>
                    </li>
                    <li >
                        <i class="iconfont icon-weibo"></i>
                        <div class="box"></div>
        
                    </li>
                    <li >
                         <i class="iconfont icon-douyin"></i>
                        <div class="box"></div>
        
                     </li>
                </ul>
            </div>
        </div>
        <!-- 版权部分 -->
    </div>

    <script src="./user.js"></script>
</body>
</html>